{% load avatar_tags %}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
    <head>
        {% load staticfiles %}
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <title>{% block title %}FanME{% endblock %}</title>
        <link href="{{ STATIC_URL }}dist/css/bootstrap.css" rel="stylesheet">
        <link href="{{ STATIC_URL }}css/tour/bootstrap-fanme.css" rel="stylesheet">
        <link rel="stylesheet" href="{{ STATIC_URL }}css/style.css" type="text/css" />
        {% block mystylesheet %}{% endblock %}
        <script src="{{ STATIC_URL }}js/jquery-1.10.2.js"></script>
        <script src="{{ STATIC_URL }}dist/js/bootstrap.js"></script>
        <script>
            // Site constants
            window.FANMEDATEFORMAT = "%d/%m/%Y";
            window.FANMEDATETIMEFORMAT = "%d/%m/%Y %H:%i";
        </script>
    </head>
    <body {% block bodystuff %}{% endblock%}>
        {% block header %}
        {% block menuArea %}
        <div class="navbar navbar-default navbar-fixed-top">
            <div class="navbar-header">
                <a href={{ logo_url }} class="navbar-brand">FanME</a>
            </div>
            {% if user.is_authenticated %}
            <div class="collapse navbar-collapse">
                {% block searchBox %}
                    {% include "dash/search_form.html" %}
                {% endblock searchBox %}
                <ul class="nav navbar-nav">
                    {% block menuOptions %}
                    {% if user.persona %}
                    <li><a href="{% url 'dashboard' %}">Dashboard</a></li>
                    <li><a href="{% url 'logbook' %}">Logbook</a></li>
                    {% else %}
                    <li><a href="{% url 'dash_empresa' %}">Dashboard</a></li>
                    <li><a href="{% url 'dash_planes' %}">Planes</a></li>
                    {% endif %}
                    {% endblock menuOptions %}
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li><span class="thumbnail"><img src="{% avatar_url user 25 %}" alt="Foto perfil"></span></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">{% if user.persona %}{{ user.first_name }}{% else %}{{ user.empresa.razon_social }}{% endif %} <span class="glyphicon glyphicon-cog"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="{% url 'edit_account' %}"><span class="glyphicon glyphicon-edit"></span> Editar Perfil</a></li>
                            <li><a href="{% url 'logout' %}"><span class="glyphicon glyphicon-log-out"></span> Salir</a></li>
                        </ul>
                    </li>
                </ul>
            {% else %}
                {% block header_login %}
                <form role="form" class="navbar-form navbar-right form-inline" action="{% url 'auth_login' %}" method="post">
                    {% csrf_token %}
                    {% for field in form_login %}
                        <div class="form-group {% if field.errors %}has-error{% endif %}">
                            {{ field }}
                            {% for error in field.errors  %}
                            <small class="text-danger">{{ error }}</small>
                            {% endfor %}
                        </div>
                    {% endfor %}
                    <div class="form-group"><button type="submit" class="btn btn-default">Ingresar</button></div>
                </form>
                {% endblock header_login %}
            {% endif %}
            </div>
        </div>
        {% endblock menuArea %}
        {% endblock header%}

        {% block breadcrumb %}
        <div class="container">
            <div class="row">
                <ol class="breadcrumb">
                    <li><a href="javascript:history.go(-1)"><span class="glyphicon glyphicon-arrow-left"></span> Atrás</a></li>
                    {% for bread in breadcrumb %}
                    <li {% if not forloop.last %}class="active"{% endif %}>{{ bread }}</li>
                    {% endfor %}
                </ol>
            </div>
        </div>
        {% endblock breadcrumb %}

        <div class="container">
        {% block messages %}
            {% if messages %}
                {% for message in messages %}
                <div class="row">
                    <div {% if message.tags %} class="alert alert-{{ message.tags }}"{% endif %}>{{ message }}</div>
                </div>
                {% endfor %}
            {% endif %}
        {% endblock messages %}
        </div>
        <!-- Begin Content -->
        <div class="container">
            {% block content %}{% endblock%}
        </div>
        <div class="container">
            <div class="row">
                {% block footer %}
                <div class="footer-line-divisor">
                    <img src="{{ STATIC_URL }}images/footer-line-divisor.png" alt="Footer Line Divisor" />
                </div>
                <!-- Eso deberia ser dinamico -->
                <div class="footer-links">
                    <a href="/dash/preguntas_mas_frecuentes/">Ayuda</a> |
                    <a href="#">Sobre Nosotros</a> |
                    <a href="#">Condiciones</a> |
                    <a href="#">Copyright</a>
                </div>
            {% endblock%}    
            </div>
        </div>
        {% block myjavascript %}{% endblock %}
    </body>
</html>
